
.create-trigger-modal__content{
    &-form{
        .form-builder{
            padding: 0;
            margin: 0;
            width: 100%;
        }
        .create-trigger-modal__trigger-way-tip{
            color: #8C8C8C;
            font-size: 12px;
            line-height: 20px;
            em {
                font-style: normal;
                color: $color-primary;
                cursor: pointer;
            }
        }
        .create-trigger-modal__trigger-way{
            padding: 0;
            margin: 6px 0 0 0;
            display: grid;
            grid-template-columns: 1fr 1fr 1fr;
            gap: 16px;
            min-height: 176px;
            &-item{
                display: flex;
                align-items: center;
                max-width: 240px;
                padding: 0 16px;
                height: 80px;
                cursor: pointer;
                border-radius: 8px;
                position: relative;
                overflow: hidden;
                box-sizing: border-box;
                border: 1px solid transparent;
                &:hover {
                    background-color: #F5F8FA;
                }
                &.active{
                     background-color: $color-primary-light-1;
                     border: 1px solid $color-primary;
                     &::after{
                        position: absolute;
                        content: " ";
                        width: 7px;
                        height: 12px;
                        transform: rotate(45deg);
                        border-right: 2px solid #fff;
                        border-bottom: 2px solid #fff;
                        top: -1px;
                        right: 2px;
                    }
                    &::before{
                        position: absolute;
                        content: '';
                        right: 0;
                        top: 0;
                        width: 0;
                        height: 0;
                        border-left: 24px solid transparent;
                        border-right: 24px solid $color-primary;
                        border-bottom: 24px solid transparent;
                    }
        
                     
                }
                &__icon{
                    width: 40px;
                    height: 40px;
                    border-radius: 4px;
                    box-sizing: border-box;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    border: 1px solid #EBEEF5;
                    margin-right: 8px;
                    .iconfont{
                        font-size: 24px;
                    }
                }
                &__label{
                    display: flex;
                    flex-direction: column;  
                    .trigger-way-item__label-title{
                        font-size: 14px;
                        font-weight: 400;
                        line-height: 22px;
                        margin: 0;
                        color: $text-color-primary;

                    }
                    .trigger-way-item__label-des{
                        color: #8C8C8C;
                        font-size: 12px;
                        line-height: 16px;
                        font-weight: 400;
                    }
                }
            }
        }
    }
}
